<template>
	<div class="city">
		<city-header></city-header>
		<city-list :city = 'city' :hotCities = 'hotCities'></city-list>
	</div>
</template>

<script>
	import CityHeader from './pages/Header'
	import CityList from './pages/List'
	import axios from 'axios'
	export default{
		components:{
			CityHeader,
			CityList
		},
		data() {
			return {
				hotCities:[],
				city:[]
			}
		},
		mounted() {
			axios.get('./city.json').then((res) => {
				const msg = res.data.data[0]
				this.hotCities = msg.hotCities;
				this.city = msg.city;
			})
		}
	}
</script>

<style scoped>
	.city{
		background-color: #f5f5f5;
	}
</style>
